<template>
  <div class="login">
    <h2>用户登录</h2>
    <form @submit.prevent="login">
      <div>
        <label>用户名：</label>
        <input v-model="username" required />
      </div>
      <div>
        <label>密码：</label>
        <input type="password" v-model="password" required />
      </div>
      <button type="submit">登录</button>
      <p>没有账号？<router-link to="/register">去注册</router-link></p>
    </form>
  </div>
</template>

<script setup>
// 登录页，用户输入用户名和密码进行登录
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useUserStore } from '../stores/user'

const username = ref('')
const password = ref('')
const router = useRouter()
const userStore = useUserStore()

function login() {
  // 简单模拟登录逻辑
  if (username.value && password.value) {
    userStore.login(username.value)
    alert('登录成功！')
    router.push('/')
  } else {
    alert('请输入用户名和密码')
  }
}
</script>

<style scoped>
.login {
  padding: 20px;
}
</style> 